<template>
	<view class="margin">
		<!--  -->
		<u-sticky style="background-color:#f5f6f7;">
			<u-gap height="20" bgColor="#f5f6f7"></u-gap>
			<u-search :showAction="false" placeholder="输入医院名称搜索" disabled @click="$pub.go('/pages_home/search/search')"
				v-model="search_wz" :clearabled="true" searchIconColor="#7976E9" borderColor="#DDDDDD"
				bgColor="#f5f6f7"></u-search>
		</u-sticky>
		<!--  -->
		<u-gap height="20" bgColor="#f5f6f7"></u-gap>
		<!--  -->
		<view class="">
			<!-- 医生列表 -->
			<view class="margin" v-for="(val,i) in doctorList" :key="i"
				@click="$pub.go(`/pages_home/createOrder/createOrder?data=${encodeURIComponent(JSON.stringify(val))}`)">
				<view class="item1 u-border-bottom mt10" style="display: flex;">
					<view class="mr10 ">
						<u-avatar :src="val.uheadPic  || '/static/img/finddoctor/02-yishen.png' "></u-avatar>
					</view>
					<view class="" style="width: 100%;">
						<u-row :gutter='5'>
							<u-col span="3">
								<view class="demo-layout bg-purple-light">
									<view class="size_16 font_b">{{val.uname ||  '默认用户'}}</view>
								</view>
							</u-col>
							<u-col span="9">
								<view class="demo-layout bg-purple">
									<view class="size_14">{{val.utechp || '副主任医师'}}</view>
								</view>
							</u-col>
						</u-row>
						<u-row class="mt8 ms10  ">
							<u-col span="8">
								<view class="demo-layout bg-purple-light">
									<view class="size_14 ">{{val.ucompname || '北京第一人民医院'}}</view>
								</view>
							</u-col>
							<u-col span="4">
								<view class="demo-layout bg-purple">
									<view class="size_14">{{val.udepartmentname || "外科"}}</view>
								</view>
							</u-col>
						</u-row>
						<view class="size_12 color_84 ms20">{{val.introduction ||  '经验丰富'}}</view>
					</view>
				</view>
			</view>
			<u-loadmore :status="status" />
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				status: 'nomore',
				curNow: 0,
				keyword: '',
				// 医生
				doctorList: [{
					uname: "钟南山",
					udepartmentname: "副主任医师",
					ucompname: "北京人民医院",
					udepartmentname: "外科",
					introduction: "经验丰富"
				}, ],
				search_wz: '',
				form: {
					"pageNum": 1,
					"pageSize": 10,
					"search": "",
					"udepartmentid": ""
				}
			};
		},
		methods: {
			async getDoctorPage() {
				let re = await this.$API.doctorApi.getDoctorById(this.form)
				this.doctorList = re.records
			},
			click(item) {
				console.log('item', item);
				this.current = item.index
			},
			sectionChange(index) {
				this.curNow = index;
			},
			radioClick(name) {
				this.radios.map((item, index) => {
					item.checked = index === name ? true : false
				})
			},
		},
		onLoad(options) {
			if (options.data) {
				this.form.udepartmentid = options.data
				let titleName = options.name
				uni.setNavigationBarTitle({
					title: titleName
				});
			}
			if (options.cc) {
				this.form.udepartmentid = options.cc
				let titleName = '名医'
				uni.setNavigationBarTitle({
					title: titleName
				});
			}

		},
		onShow() {
			this.getDoctorPage()
		},
		// 触底加载
		onReachBottom() {
			return
			this.status = 'loading'
			setTimeout(() => {
				this.status = 'nomore'
				this.form.pageNum++
				this.getDoctorPage()
			}, 500)
		},
		watch: {
			search_wz(val, value) {
				console.log(val)
				if (val == '') {} else {

				}
				// console.log(value)
			}
		},
		onPullDownRefresh() {
			return
			let that = this;
			that.form.pageNum = 1
			that.getDoctorPage(that.form)
			uni.stopPullDownRefresh()
		},
	}
</script>
<style>
	page {
		background: #f5f6f7;

	}
</style>


<style lang="scss" scoped>


	/* #ifdef MP */
	::v-deep .u-search__content__input{
		font-size: 28rpx !important;
	}
	/* #endif */
	/* 更改tag切换颜色 */
	::v-deep .u-tag--primary {
		background-color: #7976E9;
		border-color: #7976E9;

	}

	::v-deep .u-tag--primary span {
		color: #FFFFFF;
	}

	.u-page__tag-item {
		// margin-right: 40rpx;
	}
</style>